﻿
<script src="@Url.Content("~/Scripts/jquery.timeago.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-timers.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/queue.js")" type="text/javascript"></script>

<script type="text/javascript">
    var lastHelpRequestId = 0;
    var serviceURL = '@Url.Action("JsonHelpRequest", "Person")';
    var helpRequestsShown = @ViewData["cantTweet"];
    var queue = new Queue();
    var helpRequests;

    function updateHelpRequests(i) {
        $.post(serviceURL, { id: lastHelpRequestId },
            function (helpRequest) {
                if (helpRequest.isNew) {
                    var newHelpRequest = $(helpRequest.html).hide().css("opacity", 0);
                    newHelpRequest.prependTo(helpRequests).slideDown(600).animate({opacity:1}, 600);
                    lastHelpRequestId = helpRequest.id;
                    queue.enqueue(newHelpRequest);
                    if (queue.getLength() > helpRequestsShown + 1){
                        var removedHelpRequest = queue.dequeue();
                        removedHelpRequest.remove();
                    }      
                }
            });
    }

    $(document).ready(function () {
        $("time.timeago").timeago();
        helpRequests = $("#help-requests");
        updateHelpRequests(0);
        helpRequests.everyTime("5s", updateHelpRequests);
    });
</script>
<style type="text/css">
    #help-requests-widget em {
        display: block;
    }

    #help-requests-widget .twtr-doc, #help-requests-widget .twtr-hd a, #help-requests-widget h3, #help-requests-widget h4, #help-requests-widget .twtr-popular {
        background-color: @ViewData["btColor"] !important;
        color: @ViewData["tColor"] !important;
    }
    #help-requests-widget .twtr-popular {
        background-color: @ViewData["btColor"] !important;
        color: @ViewData["sColor"] !important;
    }
    #help-requests-widget .twtr-tweet a {
        color: #2667B5 !important;
    }
    #help-requests-widget .twtr-bd, #help-requests-widget .twtr-timeline i a, #help-requests-widget .twtr-bd p {
        color: @ViewData["sColor"] !important;
    }
    #help-requests-widget .twtr-new-results, #help-requests-widget .twtr-results-inner, #help-requests-widget .twtr-timeline {
        background: none repeat scroll 0 0 @ViewData["bsColor"] !important;
    }
    #help-requests-widget .twtr-avatar {
        display: block;
    }
    #help-requests-widget .twtr-user {
        display: inline;
    }
    #help-requests-widget .twtr-tweet-text {
        margin-left: 40px;
    }
    #help-requests-widget .twtr-popular {
        display: inline-block;
    }
</style>

<div id="help-requests-widget" class="twtr-widget twtr-widget-profile">
    <div class="twtr-doc" style="width: @ViewData["twidth"]px">
        <div class="twtr-hd">
            <a class="twtr-profile-img-anchor" href="@Url.Action("HelpRequests", "Person")" target="_blank">
                <img class="twtr-profile-img" src="@Url.Action("Imagen", "Recursos", new {id = ViewBag.Site.id})" alt="profile" style="max-width:32px;max-height:32px;"/>
            </a>
            <h3>@ViewBag.Site.tituloWeb - Help requests</h3>
            <h4>
                <a href="@Url.Action("Index", "Home")" target="_blank">@ViewBag.Site.subtituloWeb</a>
            </h4>
        </div>
        <div class="twtr-bd">
            <div class="twtr-timeline" style="height: @ViewData["theigth"];">
                <div id="help-requests" class="twtr-tweets">
                </div>                
            </div>
        </div>
        <div class="twtr-ft">
            <div>
                <a href="@Url.Action("ContactUs","Home")" target="_blank">
                    <img src="@Url.Content("~/Content/images/logowidget.png")" alt="LOGO SISOCANA FOR HIRE"/>
                </a>
                <span class="slogan">
                    <a class="twtr-join-conv" href="@Url.Action("About","Home")" style="color:@ViewData["tColor"];"
                    target="_blank">
                        @if ((int)@ViewData["twidth"] < 255)
                        {
                            <span>Because we care</span>
                        }
                        else
                        {                           
                            <span>Making the world a better place</span>
                        }
                    </a>
                </span>
            </div>
        </div>
    </div>
</div>